import { pinyin } from 'pinyin-pro';
import area from '@/area.js'

const designatedArea = ref([]) // 指定地区列表
const itemDesignatedArea = ref({}) // 单个指定地区
const designatedAreDialogShow = ref(false) // 指定地区弹窗
// dialog是否编辑
const isEditFreight = computed(()=>{
  return Object.keys(itemDesignatedArea.value).length ? true : false
})

export const useFreightAction = () => {
  return {
    designatedArea,
    itemDesignatedArea,
    designatedAreDialogShow,
    isEditFreight
  }
}

const panelAreaDialogShow = ref(false) // 面板地区弹窗
const panelArea = ref([]) // 面板地区列表
const panelAreaNameList = ref('') // 面板地区名称列表
export const usePanelAreaDialog = () => {
  return{
    panelAreaDialogShow,
    panelArea,
    panelAreaNameList
  }
}

export const useAreaGroup = () => {
  let { province } = area
  const unProvince = ['测试省', '香港特别行政区', '台湾省', '澳门特别行政区']
  province = province.filter(item => {
    return !unProvince.includes(item.area_name)
  })
  province = province.map(item => {
    const py = pinyin(item.area_name, { pattern: 'first', type: 'array', toneType: 'none' })[0].toUpperCase()
    return {
      ...item,
      isChecked: false,
      py
    }
  }).sort((a, b) => {
    return a.py.charCodeAt() - b.py.charCodeAt()
  })
  const group = {
    'ABCFG': [],
    'HJ': [],
    'LNQS': [],
    'TXYZ': []
  }
  for (let key in group) {
    province.forEach(item => {
      if (key.includes(item.py)) {
        group[key].push(item)
      }
    })
  }
  [group['ABCFG'][0], group['ABCFG'][1]] = [group['ABCFG'][1], group['ABCFG'][0]]
  return {
    group,
    province
  }
}